.loading-view-wrap{
  width: 100%;
  height: 100%;
}


.loading-view{
  position: relative;
  width: 150px;
  margin: 273px auto 0 auto;

}

.message{
  width: 100px;
  position: absolute;
  top: 40px;
  left: 18px;
  color: #989292;
  font-size: 14px;
  text-align: center;

}

.spinner{
  position: relative;
  width: 110px;
  height: 50px;
  margin: 0 auto;
  .spinner-container{
    width: 100px;
    height: 100px;
    position: absolute;

    &.container2{
      transform: rotateZ(136deg);
    }

    .fa-circle{
      position: absolute;
      color: rgba(132, 129, 126, 0.23);
      font-size: 1.5rem;
      animation: move 1.2s infinite ease-in-out;
    }

    @keyframes move{
      0%, 80%, 100% {transform: scale(0.0);}
      40% {transform: scale(1.0);}
    }

    &.container1{
      .circle2{animation-delay: -0.2s; }
      .circle3{animation-delay: -0.4s; }
      .circle4{animation-delay: -0.6s; }
    }

    &.container2{
      .circle1{animation-delay: -0.3s; }
      .circle2{animation-delay: -0.5s; }
      .circle3{animation-delay: -0.7s; }
      .circle4{animation-delay: -0.1s; }
    }

    .circle1{
      top: 0;
      left: 0;
    }

    .circle2{
      top: 0;
      right: 0;
    }

    .circle3{
      bottom: 0;
      right: 0;
    }

    .circle4{
      bottom: 0;
      left: 0;
    }
  }
}

#loading-position{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  background: #292626;
  opacity: 0.5;
}
